<template>
  <div>
    <el-button type="primary" @click="add">添加</el-button>
    <list-vue :info="info" :arr="arr" @willUpdate="willUpdate" @init="getList"></list-vue>
    <form-vue :info="info" :arr="arr" ref="form" @init="getList"></form-vue>
  </div>
</template>
<script>
import { mapGetters, mapActions } from "vuex";
import { reqcatelist } from "../../http/api";
import formVue from "./components/form.vue";
import listVue from "./components/list.vue";
export default {
  components: {
    formVue,
    listVue,
  },
  data() {
    return {
      info: {
        isshow: false,
        isAdd: false,
      },
      arr: [],
    };
  },
  computed: {
    ...mapGetters({}),
  },
  mounted() {
    this.getList();
  },
  
  methods: {
    getList() {
    reqcatelist({ istree: true }).then((res) => {
      this.arr = res.data.list;
    });
  },
    ...mapActions({}),
    willUpdate(id) {
      this.isshow = true;
      this.isAdd = false;
      this.$refs.form.getOne(id);
    },
    add() {
      this.info.isshow = true;
      this.info.isAdd = true;
    },
  },
};
</script>
<style scoped lang="less">
@import "../../less/index.less";
.el-button {
  margin: 20px;
}
</style>